<div class="bg-gray-50 sm:pt-12 lg:pt-26">
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
    <div class="max-w-4xl mx-auto text-center">
      <h2 class="text-3xl font-extrabold text-gray-900 sm:text-4xl"><%= t(".title") %></h2>
      <p class="mt-3 text-xl text-gray-500 sm:mt-4"><%= t(".description") %></p>
    </div>
  </div>
  <div class="mt-10 pb-18 bg-white">
    <div class="relative">
      <div class="absolute inset-0 h-1/2 bg-gray-50"></div>
      <div class="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div class="max-w-4xl mx-auto">
          <dl class="rounded-lg bg-white shadow-lg sm:grid sm:grid-cols-3">
            <div class="flex flex-col border-b border-gray-100 p-6 text-center sm:border-0 sm:border-r">
              <dt class="order-2 mt-2 text-lg leading-6 font-medium text-gray-500"><%= t(".rails_developers") %></dt>
              <dd class="order-1 text-5xl font-extrabold text-gray-700"><%= stats.developers %>+</dd>
            </div>
            <div class="flex flex-col border-t border-b border-gray-100 p-6 text-center sm:border-0 sm:border-l sm:border-r">
              <dt class="order-2 mt-2 text-lg leading-6 font-medium text-gray-500"><%= t(".response_rate") %></dt>
              <dd class="order-1 text-5xl font-extrabold text-gray-700"><%= (stats.response_rate * 100).round %>%</dd>
            </div>
            <div class="flex flex-col border-t border-gray-100 p-6 text-center sm:border-0 sm:border-l">
              <dt class="order-2 mt-2 text-lg leading-6 font-medium text-gray-500"><%= t(".new_devs") %></dt>
              <dd class="order-1 text-5xl font-extrabold text-gray-700"><%= stats.new_devs %>+</dd>
            </div>
          </dl>
        </div>
      </div>
    </div>
  </div>
</div>
